<template>
   <div class="exchangeSubmit">
        <assets-head title="" :goHome="true"/>
        <div class="flex flex-col items-center">
            <img src="@/assets/image/assets-center/small-success.png" alt="logo" class="w-122 h-122 mt-120" />
            <p class="font-38 text-center pt-60 textColor">{{ $t('闪兑成功') }}</p>
            <p class="font-50 mt-23 text-center textColor">{{detail.get_volume }}<span class="text-grey font-35">  {{detail.symbol_to && detail.symbol_to.toUpperCase()}}</span></p>
            <ul class="mx-32 px-30 pt-20 pb-34 mt-53 rounded flex-1 w-full box-border">
                <li class="flex justify-between font-32 pt-25 pb-25 px-16 tabBackground textColor">
                    <span>{{ $t('闪兑自') }}</span>
                    <span class="text-grey">{{detail.volume}} {{detail.symbol && detail.symbol.toUpperCase()}}</span>
                </li>
                <!-- <li class="flex justify-between font-32 px-16 py-25 tabBackground textColor">
                    <span>{{ $t('汇率') }}</span>
                    <span class="text-grey">1 {{detail.symbol && detail.symbol.toUpperCase()}}≈{{detail.rate}} {{detail.symbol_to && detail.symbol_to.toUpperCase()}}</span>
                </li> -->
            </ul>
             <div class="h-100 rounded flex justify-between px-32 box-border items-center mt-56 mb-48 text-white w-full">
                    <p class="w-360 h-80 rounded flex justify-center items-center bgDark" @click="route('/home')">
                      {{ $t('返回首页') }}</p>
                    <p class="w-360 h-80 rounded btnMain flex justify-center items-center" @click="route('/exchange/exchangeHistory')">
                      {{ $t('查看历史') }}</p>
                </div>
        </div>
   </div>
</template>

<script>
import assetsHead from "@/components/assets-head";
import {Image as VanImage} from "vant";
export default {
    data() {
        return {
            detail: {}
        }
    },
    components:{
      assetsHead,
    },
    created() {

    },
    methods:{
        onClickLeft() {
            this.$router.go(-1)
        },
        route(path) {
            this.$router.push(path)
        }
    },
    beforeRouteEnter(to, from, next) {
        const { query : { data }} = to
        next(vm => {
            vm.detail = JSON.parse(data)
        })
    }
}
</script>
<style lang="scss" scoped>

.exchangeSubmit{
    width: 100%;
    box-sizing: border-box;
}
.bg-grey-light {
    background: #F5F5F5;
}
.bg-grey-dark {
    background: #C8CAD2;
}
</style>
